<template>
   <div class="layui-col-md4">
  <div class="fly-panel">
    <h3 class="fly-panel-title">温馨通道</h3>
    <ul class="fly-panel-main fly-list-static">
      <li>
        <a href="https://github.com/leiphp/100txy" target="_blank">雷小天博客微信小程序，欢迎Star</a>
      </li>
      <li>
        <a href="https://github.com/leiphp/Django-myblog" target="_blank">Django入门与实践--Python制作个人博客网站</a>
      </li>
      <li>
        <a href="https://github.com/leiphp/python3-website" target="_blank">Python网站开发源码实战篇，欢迎Star</a>
      </li>
      <li>
        <a href="https://github.com/leiphp/stm32-code" target="_blank">STM32-PZ6806L开发板全套源代码程序</a>
      </li>
      <li>
        <a href="https://github.com/leiphp/spider-baike" target="_blank">实战案例爬取百度百科1000条词条数据，欢迎Star</a>
      </li>
    </ul>
  </div>


  <div class="fly-panel fly-signin">
    <div class="fly-panel-title">
      签到
      <i class="fly-mid"></i>
      <a href="javascript:;" class="fly-link" id="LAY_signinHelp" @click="signinHelp = true">说明</a>
      <i class="fly-mid"></i>
      <a href="javascript:;" class="fly-link" id="LAY_signinTop"  @click="signTop">活跃榜<span class="layui-badge-dot"></span></a>
      <span class="fly-signin-days">已连续签到<cite>{{sign_info.days}}</cite>天</span>
    </div>
    <div class="fly-panel-main fly-signin-main">
      <template v-if="is_sign === false">
        <button class="layui-btn layui-btn-danger" @click="signin" id="LAY_signin">今日签到</button>
        <span>可获得<cite>5</cite>飞吻</span>
      </template>
      <!-- 已签到状态 -->
      <template v-else>
        <button class="layui-btn layui-btn-disabled">今日已签到</button>
        <span>获得了<cite>{{sign_info.reward}}</cite>飞吻</span>
     </template>
    </div>
  </div>

  <div class="fly-panel fly-rank fly-rank-reply" id="LAY_replyRank">
    <h3 class="fly-panel-title">回贴周榜</h3>
    <dl>
      <!--<i class="layui-icon fly-loading">&#xe63d;</i>-->
      <dd v-for="(item) in reply" :key="item.id">
        <a href="/user/{{item.Id}}">
          <img :src="item.HeadImg"><cite>{{item.Nickname}}</cite><i>{{item.ReplyNum}}次回答</i>
        </a>
      </dd>
    </dl>
  </div>

  <dl class="fly-panel fly-list-one">
    <dt class="fly-panel-title">本周热议</dt>
      <div  v-if="comment">
        <dd v-for="(item) in comment" :key="item.Id">
          <a href="{:url('solution/index/detail',array('id'=>$v.postid))}">{{item.Title}}</a>
          <span><i class="iconfont icon-pinglun1"></i> {{item.CommentNum}}</span>
        </dd>
      </div>
    <div v-else class="fly-none">没有相关数据</div>
  </dl>

  <div class="fly-panel">
    <div class="fly-panel-title">
      优惠券领取
    </div>
    <div class="fly-panel-main">
      <a href="https://www.aliyun.com/minisite/goods?userCode=aykpk5i5" target="_blank" class="fly-zanzhu" time-limit="2017.09.25-2099.01.01" style="background-color: #5FB878;">【云小站】新老客返现+现金红包+瓜分60万奖池</a>
      <a href="https://promotion.aliyun.com/ntms/act/qwbk.html?userCode=aykpk5i5" target="_blank" class="fly-zanzhu" time-limit="2017.09.25-2099.01.01" style="background-color: #5FB878;">【全民云服务搭建】云主机3年付低至3折</a>
      <a href="https://promotion.aliyun.com/ntms/act/enterprise-discount.html?userCode=aykpk5i5" target="_blank" class="fly-zanzhu" time-limit="2017.09.25-2099.01.01" style="background-color: #5FB878;">【新老用户福利】企业级云服务器 1折特惠</a>
    </div>
  </div>

  <div class="fly-panel" style="padding: 20px 0; text-align: center;">
    <img src="../assets/imgs/newweixin.jpg" style="max-width: 100%;" alt="layui">
    <p style="position: relative; color: #666;">微信扫码关注公众号</p>
  </div>

  <div class="fly-panel fly-link">
    <h3 class="fly-panel-title">友情链接</h3>
    <dl class="fly-panel-main">
      <dd><a href="http://www.100txy.com/" target="_blank">雷小天博客</a>
      </dd>
      <dd><a href="http://www.lxtkj.cn/" target="_blank">雷小天科技</a>
      </dd>
      <dd><a href="http://www.10php.cn/" target="_blank">PHP下载网</a>
      </dd>
      <dd><a href="http://www.chesg.com/" target="_blank">车时光</a>
      </dd>
      <dd><a href="mailto:xianxin@layui-inc.com?subject=%E7%94%B3%E8%AF%B7Fly%E7%A4%BE%E5%8C%BA%E5%8F%8B%E9%93%BE" class="fly-link">申请友链</a>
      </dd>
    </dl>
  </div>

   <el-dialog v-model="signinHelp" title="签到说明" width="300px">
    <div class="layui-text">
        <blockquote class="layui-elem-quote">“签到”可获得社区飞吻，规则如下</blockquote>
        <table class="layui-table">
          <thead>
            <tr><th>连续签到天数</th><th>每天可获飞吻</th></tr>
          </thead>
          <tbody>
            <tr><td>＜5</td><td>5</td></tr>
            <tr><td>≥5</td><td>10</td></tr>
            <tr><td>≥15</td><td>15</td></tr>
            <tr><td>≥30</td><td>20</td></tr>
          </tbody>
        </table>
        <ul>
          <li>中间若有间隔，则连续天数重新计算</li>
          <li style="color: #FF5722;">不可利用程序自动签到，否则飞吻清零</li>
        </ul>
      </div>
  </el-dialog>

</div>
</template>

<script>
import request from '@/utils/request'
import { ElMessage } from 'element-plus'
import Cookies from 'js-cookie'
export default {
  name: 'Right',
  data() {
    return {
      comment: [], //帖子评论
      reply: [], //评论回复
      signinHelp: false,
    };
  },
  created() {
    //获取本周热议
    this.getWeekHotData()
    //获取用户签到数据
    this.getUserSign()
  },
  computed:{
        // is_sign:this.$store.getters.getSignInfo.is_sign,
        is_sign:function(){
            return this.$store.getters.getSignInfo.is_sign;
        },
        sign_info:function(){
            return this.$store.getters.getSignInfo.signInfo;
        }
  },
  methods: {
    //获取本周热议
    getWeekHotData() {
      const params = {
        params: {
        }
      }
      request.get('/micro-bbs/v1/home/weekHotData', params).then((res) => {
        const { code, data } = res
        if (code === 200) {
          this.comment = data.comment
          this.reply = data.reply
          // ElMessage({
          //     message: '数据加载成功！',
          //     type: 'success',
          //     offset: 200
          //  })
        }
      })
    },
    //今日签到
    signin(){
      //判断用户是否登录
      if(Cookies.get('app.token') === ""){
         ElMessage({
              message: '签到请先登录!',
              type: 'error',
              offset: 200,
        })
      }else{
        //执行签到
        this.doSignin()
      }
    },
    //签到请求
    doSignin(){
      const params = {
        params: {
        }
      }
      request.get('/micro-bbs/v2/members/signin', params).then((res) => {
        const { code, data,msg } = res
        if (code === 200) {
          console.log("data:",data)
          ElMessage({
              message: '恭喜你，签到成功！',
              type: 'success',
              offset: 200
           })
        }else{
          ElMessage({
              message: msg,
              type: 'error',
              offset: 200
           })
        }
      })
    },
    //获取用户签到
    getUserSign(){
      if(Cookies.get('app.token') != ""){
         const params = {
        params: {
        }
      }
      request.get('/micro-bbs/v2/members/signinfo', params).then((res) => {
        const { code, data } = res
        if (code === 200) {
          console.log("data:",data)
          // this.isSign = data.is_sign
          // this.signinfo = data.signInfo
          this.$store.commit('setSignInfo',data)
        }else{
          //未签到不处理
        }
      })
      }
    },
    signTop(){
      ElMessage({
        message: '暂未开通',
        type: 'warning',
        offset: 200
      })
    }
  }
}
</script>
